<template>
  <div class="page-box">
    <!--    <el-descriptions-->
    <!--      class="title"-->
    <!--      title="当前版本信息"-->
    <!--      :column="2"-->
    <!--      border-->
    <!--    >-->
    <!--      <template #extra>-->
    <!--        <el-button type="primary" @click="updateV()">更新版本</el-button>-->
    <!--      </template>-->
    <!--      <el-descriptions-item>-->
    <!--        <template #label>-->
    <!--          <div class="cell-item">-->
    <!--            标题-->
    <!--          </div>-->
    <!--        </template>-->
    <!--        {{versionData.title}}-->
    <!--      </el-descriptions-item><el-descriptions-item>-->
    <!--        <template #label>-->
    <!--          <div class="cell-item">-->
    <!--            版本号-->
    <!--          </div>-->
    <!--        </template>-->
    <!--      <el-tag size="small">V{{ versionData.version }}</el-tag>-->
    <!--      </el-descriptions-item>-->
    <!--      <el-descriptions-item>-->
    <!--        <template #label>-->
    <!--          <div class="cell-item">-->
    <!--            下载地址-->
    <!--          </div>-->
    <!--        </template>-->
    <!--        {{versionData.url}}-->
    <!--      </el-descriptions-item>-->
    <!--      <el-descriptions-item>-->
    <!--        <template #label>-->
    <!--          <div class="cell-item">-->
    <!--            创建时间-->
    <!--          </div>-->
    <!--        </template>-->
    <!--        {{versionData.createDate}}-->
    <!--      </el-descriptions-item>-->
    <!--      <el-descriptions-item>-->
    <!--        <template #label>-->
    <!--          <div class="cell-item">-->
    <!--            更新内容-->
    <!--          </div>-->
    <!--        </template>-->
    <!--        {{versionData.contents}}-->
    <!--      </el-descriptions-item>-->
    <!--    </el-descriptions>-->
    <!--    <div style="height: 30px"></div>-->

    <!--    <p style="color: #FFFFFF; font-size: 18px;font-weight: 500">版本历史记录</p>-->
    <p>
      <el-button type="primary" @click="updateV()">更新版本</el-button>
    </p>
    <div style="height: 10px"></div>

    <el-table v-loading="dataListLoading" :data="dataList" border @selection-change="dataListSelectionChangeHandle"
              @sort-change="dataListSortChangeHandle" style="width: 100%">
      <el-table-column prop="title" label="标题" header-align="center" align="center"></el-table-column>
      <el-table-column prop="version" label="版本号" show-overflow-tooltip header-align="center" align="center">
        <template #default="scope">
          <el-tag size="small">V{{ scope.row.version }}</el-tag>
        </template>
      </el-table-column>
      <el-table-column prop="createDate" label="创建时间" show-overflow-tooltip header-align="center"
                       align="center"></el-table-column>
      <el-table-column prop="contents" label="更新内容" header-align="center" align="center"></el-table-column>
    </el-table>
    <el-pagination :current-page="page" :page-sizes="[10, 20, 50, 100]" :page-size="limit" :total="total"
                   layout="total, sizes, prev, pager, next, jumper" @size-change="pageSizeChangeHandle"
                   @current-change="pageCurrentChangeHandle"></el-pagination>

  </div>

  <UpdateVersion ref="updateversion" @close="close()"></UpdateVersion>
</template>

<style scoped lang="scss">
:deep(.el-descriptions__title) {
  color: #FFFFFF;
}

:deep(.el-descriptions__label.el-descriptions__cell.is-bordered-label) {
  color: #FFFFFF;
  background: #17b4d7;
}

:deep(.el-descriptions__content.el-descriptions__cell.is-bordered-content) {
  color: #FFFFFF;
}
</style>


<script>
import useView from "@/hooks/useView";
import {defineComponent, reactive, toRefs} from "vue"
import AddForm from "@/views/kxstation/addForm.vue";
import baseService from "@/service/baseService";
import UpdateVersion from "@/views/appVersionManagement/updateVersion.vue";

export default defineComponent({
  components: {
    UpdateVersion
  },
  setup() {
    const state = reactive({
      getDataListURL: "/KxAppVersion/kxappversion/page",
      getDataListIsPage: true,
      deleteURL: "/KxAppVersion/kxappversion",
      deleteIsBatch: true,
      versionData: {
        title: "",
        version: "",
        url: "",
        paltform: "",
        contents: "",
        createDate: ""
      }
    });
    return {...useView(state), ...toRefs(state)};
  },
  created() {
    this.getVersion();
  },
  methods: {
    getVersion() {
      baseService.post("/app/getVersion").then((res) => {
        if (res.code !== 0) {
          return this.$message.error(res.msg);
        }
        console.log(res.data)
        if (res.data != null) {
          this.versionData = res.data;
        }
      });
    },
    updateV() {
      this.$refs.updateversion.init();
    },
    close() {
      this.getVersion();
      this.getDataList();
    }
  }
});
</script>
